<template>
    <a-modal width="50%" title="表达式选择" :visible="visible" @cancel="handleCancel" @ok="$emit('show')">
        <a-table rowKey="expression" :columns="columns" :data-source="dataSource" bordered
            :rowSelection="{ selectedRowKeys: selectedRowKeysArray, onChange: onSelectChange, type: 'radio' }">
        </a-table>
    </a-modal>
</template>

<script>
export default {
    props: {
        loading: {
            type: Boolean,
            required: true
        }
    },
    watch: {
        loading() {
            this.visible = this.loading;
        }
    },
    data() {
        return {
            visible: false,
            formData: {
                name: ''
            },
            columns: [
                {
                    title: "描述",
                    dataIndex: "description",
                    key: "description"

                },
                {
                    title: "表达式",
                    dataIndex: "expression",
                    key: "expression"

                }
            ],
            dataSource: [
                { description: "获取发起人", expression: "${applyUserId}" },
                { description: "测试", expression: "${flowUtil.stringToList(assigneeUserIdList)}" },
                { description: "获取指定的下一步会签人员", expression: "	${flowUtil.stringToList(assigneeUserIdList)}" }
            ],
            selectedRowKeysArray: [],
            selectedRows: null
        }
    },
    methods: {
        handleCancel() {
            this.visible = false
            this.$emit("show")
        },

        onSelectChange(selectedRowKeys, selectedRows) {
            this.selectedRowKeysArray = selectedRowKeys;
            this.selectedRows = selectedRows;
            
        }
    }
}
</script>

<style>

</style>